import React, { PureComponent } from 'react';
import {
    Row,
    Col,
    Card,
    Form,
    Button,
    Input,
    DatePicker,
    Table,
    Select,
    Icon,
    Divider,
    Popconfirm,
    Modal,
    message,
    Alert,
    Steps
} from 'antd';
import moment from 'moment';
import { connect } from 'dva';
import router from 'umi/router';
const FormItem = Form.Item;
const Option = Select.Option;

@Form.create()
@connect(({ emergency, assessment }) => ({
    Equip: emergency.Equip,
    companyList: assessment.companyList
}))
export default class EmergEditPerson extends PureComponent {
    constructor(props) {
        super(props);
        this.state = {
          

        };
        this.dispatch = this.props.dispatch;
        this.routeParams = this.props.match.params;
    }
    submitEditValues = () => {
        this.props.form.validateFields((err, values) => {
            if (!err) {
                values.id  = this.routeParams.id;
                const hide = message.loading('正在修改...', 0);
                this.dispatch({
                    type: 'emergency/fetchEmergencyEditPerson',
                    payload: {
                        model: values,
                    },
                    callback: response => {
                        hide();
                        if (response.status) {
                            message.success('修改成功');
                            router.push({ pathname: '/municipal/emergency' });
                        } else {
                            message.error('修改失败');
                            console.log(response.ErrorMessage);
                        }
                    },
                });
            }

        })
    }
    fetchEmergencyQueryEquipByID = ({ id = null } = {}) => {
        this.dispatch({
            type: 'emergency/fetchEmergencyQueryEquipByID',
            payload: {
                id: id,
            },
            callback: response => {

                message.error('详情请求失败');
                console.log(response.ErrorMessage);

            },
        });
    }
    componentDidMount() {
        
        this.fetchEmergencyQueryEquipByID({ id: this.routeParams.id });
        // !this.props.companyList && this.fetchGetCompany();
    }
    render() {
        const { getFieldDecorator } = this.props.form;
        const { Equip,companyList } = this.props;
        const formItemLayout = {
            labelCol: {
                xs: { span: 24 },
                sm: { span: 12 },
            },
            wrapperCol: {
                xs: { span: 24 },
                sm: { span: 24 },
            },
        };
        const width = '300px';
        return (
            <>
                <Card
                    title={
                        <span style={{ borderLeft: '4px solid #3CB371', paddingLeft: '10px' }}>
                           基本信息 | {Equip && Equip[0].zbbmc}
                        </span>
                    }
                    style={{ margin: '10px' }}
                >
                    <Card style={{ width: '70%', margin: 'auto' }}>
                        <Form labelAlign="left" layout={'inline'} {...formItemLayout} onSubmit={this.submitEditValues}>
                        <Row>
                            <Col span={8} offset={4}>
                                <FormItem label="装备表名称" >
                                    {getFieldDecorator('zbbmc', {
                                        rules: [{ required: true, message: '请填写人员表名称！' }],
                                        initialValue: Equip && Equip[0].zbbmc,
                                    })(<Input placeholder="装备表名称" style={{ width: width }} />)}
                                </FormItem>
                            </Col>
                            <Col span={12}>
                                <FormItem label="建设部门" >
                                    {getFieldDecorator('jsbm', { rules: [{ required: true, message: '请选择建设部门！' }], initialValue: Equip && Equip[0].jsbmmc })(
                                        <Select style={{ width: width }}>
                                            {companyList && companyList.map(item =>
                                                <Option key={item.Id} value={item.Id}>
                                                    {item.Name}
                                                </Option>
                                            )}
                                        </Select>
                                    )}
                                </FormItem></Col>
                        </Row>
                        <Row>
                        <Col span={8} offset={4}>
                                <FormItem label="负责人" >
                                    {getFieldDecorator('fzra', {
                                        initialValue:  Equip && Equip[0].fzra ,
                                    })(<Input placeholder="负责人" style={{ width: width }} />)}
                                </FormItem>
                            </Col>
                            <Col span={12}>
                                <FormItem label="负责人职务" >
                                    {getFieldDecorator('fzrazw', {
                                        initialValue:  Equip && Equip[0].fzrazw,
                                    })(<Input placeholder="负责人职务" style={{ width: width }} />)}
                                </FormItem></Col>
                        </Row>
                        <Row>
                        <Col span={8} offset={4}>
                                <FormItem label="负责人联系方式" >
                                    {getFieldDecorator('fzralxfs', {
                                        initialValue:  Equip && Equip[0].fzralxfs,
                                    })(<Input placeholder="负责人联系方式" style={{ width: width }} />)}
                                </FormItem>
                            </Col>
                        </Row>
                        <Row>
                        <Col span={8} offset={4}>
                                <FormItem label="应急联系人" >
                                    {getFieldDecorator('yjlxra', {
                                        initialValue:  Equip && Equip[0].yjlxra,
                                    })(<Input placeholder="应急联系人" style={{ width: width }} />)}
                                </FormItem>
                            </Col>
                            <Col span={12}>
                                <FormItem label="应急联系人职务" >
                                    {getFieldDecorator('yjlxrazw', {
                                        initialValue:  Equip && Equip[0].yjlxrazw,
                                    })(<Input placeholder="应急联系人职务" style={{ width: width }} />)}
                                </FormItem></Col>
                        </Row>
                        <Row>
                        <Col span={8} offset={4}>
                                <FormItem label="应急联系人联系方式" >
                                    {getFieldDecorator('yjlxralxfs', {
                                        initialValue:  Equip && Equip[0].yjlxralxfs,
                                    })(<Input placeholder="应急联系人联系方式" style={{ width: width }} />)}
                                </FormItem>
                            </Col>
                        </Row>
                        <Row>
                        <Col span={20} offset={4}>
                                <FormItem label="备注" >
                                    {getFieldDecorator('bz', {
                                        initialValue:  Equip && Equip[0].bz,
                                    })(<Input.TextArea placeholder="备注" style={{ width: '400px' }} rows={3} />)}
                                </FormItem>
                            </Col>
                        </Row>
                        <Row>
                            <Col span={8} offset={4}>
                            <Form.Item >
                                <Button type="primary" htmlType="submit">
                                    确定
                                </Button>
                            </Form.Item>
                            </Col>
                            </Row>
                        </Form>
                    </Card>
                </Card>
            </>
        )
    }
}